@import "~antd/lib/style/themes/default.less";

i.trigger {
  background    : #374551;
  font-size     : 20px;
  line-height   : 64px;
  cursor        : pointer;
  transition    : all .3s, padding 0s;
  vertical-align: middle;
  padding       : 0 22px;
  color         : #fff;
}

.item::before {
  position        : absolute;
  top             : 0;
  right           : 0;
  bottom          : 0;
  left            : 0;
  background-color: transparent;
  content         : '';
}

.items {
  margin-bottom: 28px;

  i {
    font-size: 20px !important;
  }
}

.item {
  text-align: center;
  color     : #9CA2A8;

  span {
    color         : #9CA2A8;
    line-height   : 20px;
    height        : 20px;
    width         : 64px;
    text-align    : center;
    opacity       : 1 !important;
    display       : block !important;
    max-width     : 64px !important;
    font-family   : PingFangSC-Regular;
    font-size     : 12px;
    color         : #9CA2A8;
    letter-spacing: 0;
  }

  i {
    font-size  : 20px !important;
    display    : block !important;
    line-height: 1 !important;
    max-width  : 64px !important;
  }
}

.triggerRouter {
  li {
    text-align: center;
    margin-top: 30px;

    div {
      font-family   : PingFangSC-Regular;
      font-size     : 12px;
      color         : #384551;
      letter-spacing: 0;
    }
  }
}




:global {

  .ant-menu-dark.ant-menu-vertical .ant-menu-item,
  .ant-menu-dark .ant-menu-item-selected {
    border-color: #1890ff !important;
  }

  .ant-menu.ant-menu-dark .ant-menu-item-selected,
  .ant-menu-submenu-popup.ant-menu-dark .ant-menu-item-selected {
    background: none !important;
  }

  .ant-menu-inline-collapsed>.ant-menu-item .anticon,
  .ant-menu-inline-collapsed>.ant-menu-item-group>.ant-menu-item-group-list>.ant-menu-item .anticon,
  .ant-menu-inline-collapsed>.ant-menu-item-group>.ant-menu-item-group-list>.ant-menu-submenu>.ant-menu-submenu-title .anticon,
  .ant-menu-inline-collapsed>.ant-menu-submenu>.ant-menu-submenu-title .anticon {
    line-height: 1 !important;
    max-width  : 64px !important;
    font-size  : 20px !important;
  }

  .ant-menu-dark,
  .ant-menu-dark .ant-menu-sub {
    background    : #ffffff !important;
    font-family   : PingFangSC-Regular;
    font-size     : 12px;
    letter-spacing: 0;
  }

  .ant-menu-item .anticon,
  .ant-menu-submenu-title .anticon {
    color: #9CA2A8 !important;
  }

  .ant-menu-item .anticon+span,
  .ant-menu-submenu-title .anticon+span {
    font-family   : PingFangSC-Regular;
    font-size     : 12px;
    color         : #9CA2A8 !important;
    letter-spacing: 0;
  }

  .ant-menu-dark .ant-menu-item,
  .ant-menu-dark .ant-menu-item-group-title,
  .ant-menu-dark .ant-menu-item>a {
    color: #9CA2A8 !important;
  }

  .ant-menu-inline-collapsed>.ant-menu-item,
  .ant-menu-inline-collapsed>.ant-menu-item-group>.ant-menu-item-group-list>.ant-menu-item,
  .ant-menu-inline-collapsed>.ant-menu-item-group>.ant-menu-item-group-list>.ant-menu-submenu>.ant-menu-submenu-title,
  .ant-menu-inline-collapsed>.ant-menu-submenu>.ant-menu-submenu-title {
    padding   : 0 0px !important;
    text-align: center;
  }

  .ant-menu-item .anticon:hover,
  .ant-menu-submenu-title .anticon:hover,
  .ant-menu-item>a:hover {
    font-family: PingFangSC-Regular;
    color      : #384551 !important;
  }
}

.globalSider {
  padding-top: 30px;

  :global {
    .ant-menu-item.ant-menu-item-selected {
      background : #ffffff;
      border-left: 4px solid #1890ff;

      a {
        margin-left: -4px;
      }
    }

    .ant-menu-item {
      margin-bottom: 28px !important;
    }

    .ant-menu-item>a {

      i {
        display: block !important;
      }

      span {
        line-height   : 20px;
        height        : 20px;
        text-align    : center;
        opacity       : 1 !important;
        display       : block !important;
        max-width     : 64px !important;
        font-family   : PingFangSC-Regular;
        font-size     : 12px;
        color         : #9CA2A8;
        letter-spacing: 0;
      }
    }
  }
}
